<template>
    <div class="container">
        <el-page-header content="出库销售汇总"></el-page-header>
        <div class="e-m-t-45 e-m-b-45">
            <el-radio-group v-model="dataType">
                <el-radio-button label="0">收入支出汇总图</el-radio-button>
                <el-radio-button label="1">入库支出</el-radio-button>
                <el-radio-button label="2">出库销售汇总</el-radio-button>
                <el-radio-button label="3">提现金额情况汇总</el-radio-button>
                <el-radio-button label="4">推广支出情况</el-radio-button>
            </el-radio-group>
        </div>
        <!-- <h4>当前未提现余额</h4> -->
        <div>
            <div class="flex" style="justify-content: space-between;">
                <h4>当前未提现余额</h4>
                <el-form :inline="true" class="demo-form-inline xuan-box">
                    <el-form-item>
                        <el-button @click="downloadbillbance()" type="primary" plain><i
                                class="iconfont icon-excel"></i>导出Excel</el-button>
                    </el-form-item>
                </el-form>
            </div>
            <el-descriptions title="" direction="vertical" :column="5" border>
                <el-descriptions-item label="接收情况用户类型">当前未提现余额</el-descriptions-item>
                <el-descriptions-item label="个人用户">{{ form.user }}</el-descriptions-item>
                <el-descriptions-item label="客户组用户">{{ form.enterprise }}</el-descriptions-item>
                <el-descriptions-item label="小哥">{{ form.brother }}</el-descriptions-item>
                <el-descriptions-item label="合计">{{ form.count }}</el-descriptions-item>
            </el-descriptions>
        </div>
        <!-- <el-divider></el-divider> -->
        <div style="margin-bottom:100px"></div>
        <div class="flex" style="justify-content: space-between;">
            <h4>成功提现金额</h4>
            <el-form :inline="true" class="demo-form-inline xuan-box">
                <el-form-item label="时间筛选">
                    <el-date-picker @change="time" :clearable="false" value-format="yyyy-MM-dd" v-model="value1"
                        type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
                    </el-date-picker>
                </el-form-item>
                <el-form-item>
                    <el-button @click="getbillwithdrawalist" type="primary">查询</el-button>
                </el-form-item>
                <el-form-item>
                    <el-button @click="downloadwithdrawa()" type="primary" plain><i
                            class="iconfont icon-excel"></i>导出Excel</el-button>
                </el-form-item>
            </el-form>
        </div>
        <div>
            <el-descriptions title="" direction="vertical" :column="5" border>
                <el-descriptions-item label="接收情况用户类型">成功提现金额</el-descriptions-item>
                <el-descriptions-item label="个人用户">{{ drawal.user }}</el-descriptions-item>
                <el-descriptions-item label="客户组用户">{{ drawal.enterprise }}</el-descriptions-item>
                <el-descriptions-item label="小哥">{{ drawal.brother }}</el-descriptions-item>
                <el-descriptions-item label="合计">{{ drawal.count }}</el-descriptions-item>
            </el-descriptions>
        </div>
    </div>
</template>

<script>
export default {
    layout: 'admin',
    head() {
        return {
            title: '出库销售汇总' ,
        }
    },
    components: {},
    props: {},
    data() {
        return {
            timeType: 0,//时间类型
            value1: "",//下单时间
            startdate: "",//下单初始
            enddate: "",//下单结束
            dataType: 3,
            tableData: [],
            multipleSelection: [],
            form: {
                brother: "",
                count: "",
                enterprise: "",
                user: "",
            },
            drawal: {}
        };
    },
    watch: {
        dataType(val){
            console.log(val)
            if(val == 0){
                this.$router.push({
					path:'/finance/statistics'
				})
            }else if(val == 1){
                this.$router.push({
					path:'/finance/receipt/receipt'
				})
            }else if(val ==2){
                this.$router.push({
					path:'/finance/receipt/outbound'
				})
            }else if(val == 3){
                this.$router.push({
					path:'/finance/receipt/cash'
				})
            } else if (val == 4) {
                this.$router.push({
                    path: '/finance/receipt/promotion'
                })
            }
        }
    },
    computed: {},
    methods: {
        //         saveAndExport(content, filename) {
        //   //接口返回的数据格式是文件流，转成通过标签直接下载
        //   const blob = new Blob([content])
        //   const _fileName = filename         
        //   if ('download' in document.createElement('a')) {
        //     // 非IE下载
        //    const elink = document.createElement('a')
        //     elink.download = _fileName
        //     elink.style.display = 'none'
        //     elink.href = URL.createObjectURL(blob)
        //     document.body.appendChild(elink)
        //    elink.click()
        //     URL.revokeObjectURL(elink.href) // 释放URL 对象
        //     document.body.removeChild(elink)
        //   } else {
        //     // IE10+下载
        //     navigator.msSaveBlob(blob, _fileName)
        //    }
        // },
        downloadbillbance() {
            this.$axios.post('/Admin/Statistics/BillBalanceDownload', {}, {
                responseType: 'blob'
            }).then(res => {
                console.log(res)
                let content = res;
                let fileName = '未提现金额11.xlsx'
                this.utils.saveAndExport(content, fileName)
            })
        },
        downloadwithdrawa() {
            this.$axios.post('/admin/statistics/billwithdrawaldownload', {
                "start": this.startdate,
                "end": this.enddate,
                "timeType": this.timeType,

            }, {
                responseType: 'blob'
            }).then(res => {
                console.log(res)
                let content = res;
                let fileName = '成功提现金额.xlsx'
                this.utils.saveAndExport(content, fileName)
            })
        },
        time(e) {
            console.log(e)
            this.startdate = e[0]
            this.enddate = e[1]
			this.timeType = 4

        },
        getbillbancelist() {
            this.$axios.get('/admin/statistics/billbalance').then(res => {
                console.log(res)
                this.form = res
            })
        },
        getbillwithdrawalist() {
            this.$axios.post('/admin/statistics/billwithdrawal', {
                "start": this.startdate,
                "end": this.enddate,
        "timeType": this.timeType,
            }).then(res => {
                console.log(res)
                this.drawal = res
            })
        }
    },
    mounted() {
        this.getbillbancelist()
        this.getbillwithdrawalist()
    }
};
</script>
<style lang="scss" scoped></style>